<template>
  <view v-if="showPrivacy" class="privacy" catchtouchmove="true">
    <view class="content">
      <view class="title">隐私政策提示</view>
      <view class="des">
        欢迎使用{{
          appName
        }}小程序！我们非常重视您的个人信息安全和隐私保护。请您在使用前点击<text
          class="link"
          @tap="openPrivacyContract"
          >{{ privacyContractName }} </text
        >并仔细阅读，请点击同意开始使用我们的服务，我们将尽全力保护您的个人信息及合法权益，感谢您的信任！
        <br />
      </view>
      <view class="btns">
        <button
          id="agree-btn"
          class="item agree"
          open-type="agreePrivacyAuthorization"
          @agreeprivacyauthorization="handleAgreePrivacyAuthorization"
        >
          同意
        </button>
        <view style="text-align: center">
          <view class="reject" @click="exitMiniProgram">不同意</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: "PrivacyPopup",
  props: ["callback"],
  data() {
    return {
      privacyContractName: "",
      isRead: false,
      resolvePrivacyAuthorization: null,
      appName: "",
    };
  },
  computed: {
    showPrivacy() {
      return this.$store.state.showPrivacy;
    },
  },
  mounted() {
    var that = this;
    let sysInfo = uni.getSystemInfoSync();
    that.appName = sysInfo.appName || "";
    if (wx.onNeedPrivacyAuthorization) {
      wx.onNeedPrivacyAuthorization((resolve) => {
        that.resolvePrivacyAuthorization = resolve;
      });
    }
    if (wx.getPrivacySetting) {
      wx.getPrivacySetting({
        success: (res) => {
          console.log(res, "getPrivacySetting");
          if (res.needAuthorization) {
            that.privacyContractName = res.privacyContractName;
            that.$store.dispatch("setShowPrivacy", true);
          }
        },
      });
    }
  },

  methods: {
    openPrivacyContract() {
      var that = this;
      wx.openPrivacyContract({
        success: () => {
          that.isRead = true;
        },
        fail: () => {
          uni.showToast({
            title: "遇到错误",
            icon: "error",
          });
        },
      });
    },
    exitMiniProgram() {
      wx.exitMiniProgram();
    },
    handleAgreePrivacyAuthorization() {
      var that = this;

      wx.requirePrivacyAuthorize({
        success: () => {
          // 用户同意授权
          // 继续小程序逻辑
        //   this.showPrivacy = false;
          that.$store.dispatch("setShowPrivacy", false);

          this.$emit("callback");
          console.log("&&&&&&&点击同意");
        },
        fail: () => {}, // 用户拒绝授权
        complete: () => {},
      });

      return;

      if (that.isRead) {
        that.$store.dispatch("setShowPrivacy", false);
        if (typeof that.resolvePrivacyAuthorization === "function") {
          that.resolvePrivacyAuthorization({
            buttonId: "agree-btn",
            event: "agree",
          });
        }
      } else {
        // uni.showToast({
        // 	title: '请先阅读隐私协议',
        // 	icon: 'error',
        // });
        wx.openPrivacyContract({
          success: () => {
            that.$store.dispatch("setShowPrivacy", false);
            if (typeof that.resolvePrivacyAuthorization === "function") {
              that.resolvePrivacyAuthorization({
                buttonId: "agree-btn",
                event: "agree",
              });
            }
          },
          fail: () => {
            uni.showToast({
              title: "遇到错误",
              icon: "error",
            });
          },
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.privacy {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.privacy-bottom {
  align-items: flex-end;
}

.content {
  width: 620rpx;
  padding: 48rpx;
  box-sizing: border-box;
  background: #fff;
  border-radius: 30rpx;
}

.content-bottom {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 48rpx;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}

.content .title {
  text-align: center;
  color: #333;
  font-weight: bold;
  font-size: 32rpx;
}

.content .des {
  font-size: 26rpx;
  color: #666;
  margin-top: 40rpx;
  text-align: justify;
  line-height: 1.6;
}

.content .des .link {
  color: $theme-color;
  text-decoration: underline;
}

.btns {
  margin-top: 48rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.btns .item {
  justify-content: center;
  border-radius: 60rpx;
  box-sizing: border-box;
  border-width: 0 !important;
}

.btns .reject {
  color: #627d8f;
  font-size: 14px;
  margin-top: 40rpx;
}

.btns .agree {
  width: 100%;
  background: $theme-color;
  color: #fff;
  font-size: 17px;
}

.privacy-bottom .btns .agree {
  width: 440rpx;
}
</style>
